<template>
  <div class="app-container">
    <el-form
      :model="queryParams"
      ref="queryRef"
      :inline="true"
      v-show="showSearch"
    >
      <el-form-item label="工艺类型" prop="technologyType">
        <el-input
          v-model.trim="queryParams.technologyType"
          style="width: 200px"
          placeholder="请输入工艺类型"
          @keyup.enter="handleQuery"
        />
      </el-form-item>

      <el-form-item>
        <el-button type="primary" icon="Search" @click="handleQuery"
          >搜索</el-button
        >
        <el-button icon="Refresh" @click="resetQuery">重置</el-button>
      </el-form-item>
    </el-form>
    <el-row :gutter="10" class="mb8">
      <el-col :span="1.5">
        <el-button type="primary" plain icon="Plus" @click="handleAdd"
          >新增</el-button
        >
      </el-col>
    </el-row>
    <div>
      <el-table v-loading="loading" border :data="dataList">
        <el-table-column label="序号" width="60" type="index" align="center" />
        <el-table-column label="工艺类型" align="center" prop="technologyType">
          <!-- <template v-slot="{ row }">
                      <el-button type="primary" @click="handleView(row)" text>{{
                          row.printMachineName
                      }}</el-button>
                  </template> -->
          <template #default="scope">
            <dict-tag
              :options="standard_technology_type"
              :value="scope.row.technologyType"
            />
          </template>
        </el-table-column>
        <el-table-column label="工艺单位" align="center" prop="unit">
          <template #default="scope">
            <dict-tag :options="standard_unit" :value="scope.row.unit" />
          </template>
        </el-table-column>
        <el-table-column
          label="计件标准"
          align="center"
          prop="pieceStandard"
        ></el-table-column>
        <el-table-column label="机器类型" align="center" prop="machineType">
          <template #default="scope">
            <dict-tag
              :options="standard_machine_type"
              :value="scope.row.machineType"
            />
          </template>
        </el-table-column>
        <el-table-column label="工作内容" align="center" prop="workContent">
          <template #default="scope">
            <dict-tag
              :options="standard_work_content"
              :value="scope.row.workContent"
            />
          </template>
        </el-table-column>
        <el-table-column
          label="品种"
          align="center"
          prop="breed"
        ></el-table-column>
        <el-table-column
          label="印张"
          align="center"
          prop="sheet"
        ></el-table-column>
        <el-table-column label="开数" align="center" prop="bookSize">
          <template #default="scope">
            <dict-tag
              :options="ems_produce_book_size"
              :value="scope.row.bookSize"
            />
          </template>
        </el-table-column>
        <el-table-column label="书刊类型" align="center" prop="bookType">
          <template #default="scope">
            <dict-tag
              :options="sys_standard_book_type"
              :value="scope.row.bookType"
            />
          </template>
        </el-table-column>
        <el-table-column
          label="计件描述"
          align="center"
          prop="pieceDescribe"
        ></el-table-column>
        <el-table-column
          label="操作"
          align="center"
          width="120"
          fixed="right"
          class-name="small-padding fixed-width"
        >
          <template #default="scope">
            <el-tooltip content="修改" placement="top">
              <el-button
                link
                type="primary"
                icon="Edit"
                @click="handleUpdate(scope.row)"
              ></el-button>
            </el-tooltip>
            <el-tooltip content="删除" placement="top">
              <el-button
                link
                type="primary"
                icon="Delete"
                @click="handleDelete(scope.row)"
              ></el-button>
            </el-tooltip>
          </template>
        </el-table-column>
      </el-table>
      <pagination
        v-show="total > 0"
        :total="total"
        v-model:page="queryParams.pageNum"
        v-model:limit="queryParams.pageSize"
        @pagination="getList"
      />
    </div>
    <addDialog
      :visible="openDialog"
      :selsetId="selsetId"
      @cancel="
        () => {
          (openDialog = false), (selsetId = '');
        }
      "
      @success="
        () => {
          (openDialog = false), (selsetId = ''), getList();
        }
      "
    ></addDialog>
  </div>
</template>

<script setup>
import { orupdateList, deleteById } from "@/api/production/standard.js";
import addDialog from "./addDialog.vue";
import { ElMessage, ElMessageBox } from "element-plus";

const { proxy } = getCurrentInstance();
const loading = ref(true);
const dataList = ref([]);
const showSearch = ref(true);
const total = ref(0);
const openDialog = ref(false);
const selsetId = ref("");
// 列显隐信息
const columns = ref([
  { key: 0, label: `状态`, visible: true },
  { key: 1, label: `报工单编码`, visible: true },
  { key: 2, label: `报工日期`, visible: true },
  { key: 3, label: `上报人人`, visible: true },
  { key: 4, label: `机台`, visible: true },
  { key: 5, label: `机长`, visible: true },
  { key: 6, label: `当班日期`, visible: true },
  { key: 7, label: `备注`, visible: true },
  { key: 8, label: `创建人`, visible: true },
  { key: 9, label: `创建时间`, visible: true },
]);

const data = reactive({
  queryParams: {
    pageNum: 1,
    pageSize: 10,
  },
});
const { queryParams } = toRefs(data);
const {
  ems_produce_book_size,
  standard_unit,
  standard_machine_type,
  standard_work_content,
  standard_technology_type,
  sys_standard_book_type,
} = proxy.useDict(
  "standard_unit",
  "standard_machine_type",
  "standard_work_content",
  "standard_technology_type",
  "sys_standard_book_type",
  "ems_produce_book_size"
);
const getList = () => {
  loading.value = true;
  orupdateList(queryParams.value)
    .then((res) => {
      loading.value = false;
      dataList.value = res.rows;
      total.value = res.total;
    })
    .catch((err) => {
      loading.value = false;
    });
};

// 新增
const handleAdd = () => {
  openDialog.value = true;
  selsetId.value = "";
};
// 编辑
const handleUpdate = (row) => {
  openDialog.value = true;
  selsetId.value = row.id;
};
// 搜索
const handleQuery = () => {
  queryParams.value.pageNum = 1;
  getList();
};

/** 重置按钮操作 */
const resetQuery = () => {
  proxy.resetForm("queryRef");
  handleQuery();
};
/** 删除按钮操作 */
function handleDelete(row) {
  proxy.$modal
    .confirm("是否确认删除该计件标准")
    .then(function () {
      return deleteById({ id: row.id });
    })
    .then(() => {
      getList();
      proxy.$modal.msgSuccess("删除成功");
    })
    .catch(() => {});
}

getList();
</script>

<style lang="scss" scoped></style>
